$btn-hover-border: #ff6b00;
$btn-hover-bgcolor: linear-gradient(270deg, #ff6b00 0%, #e66000 100%);
$btn-disabled-bgcolor: linear-gradient(270deg, #ffc380 0%, #ffa77f 100%);
$btn-bgcolor: linear-gradient(270deg, #ff8800 0%, #ff5000 100%);
$btn-disabled-color: #ffa880;
$btn-hover-text-color: #e84900;

.large {
  min-width: 420px;
  width: 420px;
  height: 54px;
}

.medium {
  min-width: 200px;
  width: 200px;
  height: 54px;
}

.small {
  min-width: 86px;
  width: 86px;
  height: 46px;
  font-size: 14px;
}

.mini {
  min-width: 58px;
  width: 58px;
  height: 40px;
}

// 改变button的样式
.el-button {
  font-size: 14px;
  padding: 0 17px;
  height: 36px;
}
.common-el-button {
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;

  &.large {
    @extend .large;
  }

  &.medium {
    @extend .medium;
  }

  &.small {
    @extend .small;
  }

  &.mini {
    @extend .mini;
  }

  &:hover {
    transition: all 200ms;
  }

  &.disabled {
    cursor: not-allowed;
  }

  &.is-disabled {
    cursor: not-allowed;
  }
}

.modify-button {
  min-width: 100px;
  height: 40px;
  & + .modify-button {
    margin-left: 20px;
  }
}
// 有边框无背景颜色，改变整体
.el-button:not(.is-plain) {
  @extend .common-el-button;
  color: $solar-theme-color-orange;
  border: 1px solid $solar-theme-color-orange;
  background: #fff;

  &:hover {
    color: #ffffff;
    border: none;
    background: $btn-hover-bgcolor;
  }

  &.disabled {
    background: $btn-disabled-bgcolor;
    border: 0;
  }
  &.is-disabled {
    background: $btn-disabled-bgcolor;
    border: 0;
  }
}
// 无边框有背景颜色，改变整体
.el-button.el-button--primary {
  @extend .common-el-button;
  color: #ffffff;
  border: none;
  background: $btn-bgcolor;

  &:hover {
    color: #ffffff;
    background: $btn-hover-bgcolor;
  }

  &.disabled {
    background: $btn-disabled-bgcolor;
    border: 0;
  }

  &.is-disabled {
    background: $btn-disabled-bgcolor;
    border: 0;
  }
}
// 时间或日期选择器之外的
.el-button.el-button--primary:not(.el-picker-panel__link-btn),
.el-button:not(.el-picker-panel__link-btn) {
  // height: 40px;
  // padding: 0 34px;
  // font-size: 16px;
}
// .modify-button.el-button.el-button--primary,
// .modify-button.el-button,
// .el-button.is-plain:not(.el-picker-panel__link-btn) {
//   height: 40px;
// }
// 有边框无背景颜色，改变文本颜色与边框颜色
.el-button.is-plain:not(.el-picker-panel__link-btn) {
  @extend .common-el-button;
  border: 1px solid #ebebeb;
  color: #253239;
  background: transparent;

  &.active {
    border: 1px solid $solar-theme-color-orange;
    color: $solar-theme-color-orange;
  }

  &:hover {
    border: 1px solid $solar-theme-color-orange;
    color: $solar-theme-color-orange;
  }

  &.disabled {
    border: 1px solid #dcdcdc;
    color: #dcdcdc;
  }
}

// 按钮形式的文本
.el-button.el-button--text {
  display: inline-flex;
  height: 20px;
  line-height: 20px;
  padding: 0;
  font-size: 12px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: $solar-theme-color-orange;

  &:hover {
    color: $btn-hover-text-color;
    .text::after {
      display: block;
      content: '';
      margin-top: 2px;
      border: 1px solid $solar-theme-color-orange;
      transition: all 200ms;
    }
  }
  &.is-disabled {
    cursor: not-allowed;
    color: #ffa880;
  }
}

// 表格的链接按钮
.el-button.table-link-btn {
  height: auto;
  white-space: inherit;
  text-align: left;
}
